<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>GraphQL over WebSocket</title>
    <script type="text/javascript" src="https://unpkg.com/graphql-ws/umd/graphql-ws.js"></script>
</head>
<body>
<p>Check the console for subscription messages.</p>
<script type="text/javascript">
    const client = graphqlWs.createClient({
        url: 'ws://localhost:8080/graphql',
    });

    // query
    (async () => {
        const result = await new Promise((resolve, reject) => {
            let result;
            client.subscribe(
                {
                    query: '{ greeting }',
                },
                {
                    next: (data) => (result = data),
                    error: reject,
                    complete: () => resolve(result),
                },
            );
        });

        console.log("Query result: " + result);
    })();

    // subscription
    (async () => {
        const onNext = (data) => {
            console.log("Subscription data:", data);
        };

        await new Promise((resolve, reject) => {
            client.subscribe(
                {
                    query: 'subscription { greetings }',
                },
                {
                    next: onNext,
                    error: reject,
                    complete: resolve,
                },
            );
        });
    })();

</script>
</body>
</html>